<html>
<head>
<title>Bamboo Asian Grille - Online Order Form</title>
<link rel="stylesheet" type="text/css" href="bamboo.css">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
	$(function(){
		$('fieldset div div').hide();
		$(':checkbox').click(function(){
			var checked = this.checked;
			$('div',$(this).parents('div:first'))
			.css('display',checked ? 'block':'none');
			$('input[type=text]',$(this).parents('div:first'))
			.attr('disabled',!checked)
			.css('color',checked ? 'black' : '#f0f0f0')
			.val(1)
			.change()
			.each(function(){ if (checked) this.focus();});
		});
		$('span[price] input[type=text]').change(function(){
			$('~ span:first',this).text(
				$(this).val() *
				$(this).parents("span[price]:first").attr('price')
			);
		});
		$('span[price] input[type=text]').change();
	});
</script>
</head>
<body>
<h1>Bamboo Asian Grille</h1>
<h2>Online Order Menu</h2>
<fieldset><legend>Appetizers</legend>
<div><label> <input type="checkbox" name="appetizers"
	value="imperial" /> Fried Imperials rolls (2) </label> <span price="3">
<input type="text" name="imperial.quantity" disabled="disabled"
	value="1" /> $<span></span> </span>
<div><label> <input type="radio" name="imperial.option"
	value="pork" checked="checked" /> Pork </label> <label> <input
	type="radio" name="imperial.option" value="vegetarian" /> Vegetarian </label>
</div>
</div>
<div><label> <input type="checkbox" name="appetizers"
	value="spring" /> Spring rolls (2) </label> <span price="4"> <input
	type="text" name="spring.quantity" disabled="disabled" value="1" /> $<span></span>
</span>
<div><label> <input type="radio" name="spring.option"
	value="pork" checked="checked" /> Pork </label> <label> <input
	type="radio" name="spring.option" value="shrimp" /> Pork and Shrimp </label> <label>
<input type="radio" name="spring.option" value="vegetarian" />
Vegetarian </label></div>
</div>
<div><label> <input type="checkbox" name="appetizers"
	value="vnrolls" /> Vietnamese rolls (4) </label> <span price="5"> <input
	type="text" name="vnrolls.quantity" disabled="disabled" value="1" /> $<span></span>
</span>
<div><label> <input type="radio" name="vnrolls.option"
	value="pork" checked="checked" /> Pork </label> <label> <input
	type="radio" name="vnrolls.option" value="shrimp" />Pork and Shrimp </label> <input
	type="radio" name="vnrolls.option" value="vegetarian" /> <label>Vegetarian</label></div>
</div>
<div><label> <input type="checkbox" name="appetizers"
	value="rangoon" /> Crab rangoon (8) </label> <span price="6"> <input
	type="text" name="rangoon.quantity" disabled="disabled" value="1" /> $<span></span>
</span>
<div><label> <input type="radio" name="rangoon.option"
	value="sweet checked=" checked"/> Sweet-and-sour sauce </label> <label>
<input type="radio" name="rangoon.option" value="hot" /> Hot mustard </label> <label>
<input type="radio" name="rangoon.option" value="both" /> Both </label></div>
</div>
<div><label> <input type="checkbox" name="appetizers"
	value="stickers" /> Pot stickers (6) </label> <span price="5"> <input
	type="text" name="stickers.quantity" disabled="disabled" value="1" />
$<span></span> </span>
<div><label> <input type="radio" name="stickers.option"
	value="pork" checked="checked" /> Pork </label> <label> <input
	type="radio" name="stickers.option" value="vegetarian" /> Vegetarian </label></div>
</div>
<div></div>
</fieldset>
</body>
</html>
